<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>为图像添加边框和边距并浮动到段落的左侧</title>
    <style>
        img {
            float: right;
            border: 1px dotted black;
            margin: 0px 0px 15px 20px;
        }
    </style>
</head>

<body>
    <p>
        在下面的段落中,图像将向右浮动。黑色虚线边界添加到图像。
        我们还添加了边缘的0 px的顶部和右侧 margin,15 px底部margin,和20 px左侧的margin的图像。使得文本远离图片:</p>
    <p>
        <img src="https://www.runoob.com/try/demo_source/logocss.gif" width="95" height="84" />
        This is some text. This is some text. This is some text.
        This is some text. This is some text. This is some text.
        This is some text. This is some text. This is some text.
        This is some text. This is some text. This is some text.
        This is some text. This is some text. This is some text.
        This is some text. This is some text. This is some text.
        This is some text. This is some text. This is some text.
        This is some text. This is some text. This is some text.
        This is some text. This is some text. This is some text.
        This is some text. This is some text. This is some text.
    </p>
</body>

</html>